<!--
 * @Description:
 * @Author: dh
 * @Date: 2022-01-21 13:41:19
 * @LastEditors: dh
 * @LastEditTime: 2022-07-22 10:41:13
-->
<template>
	<div>vue2.0mixins将执行合并替换，vue3.0执行替换</div>
</template>

<script lang="ts">
import { defineComponent, reactive, toRefs } from 'vue';

// 混合好像只能用data
const mixin = {
	// setup() {
	//     const state = reactive({
	//         name: "deng",
	//         obj: {
	//             a: 1,
	//             b: 2,
	//         },
	//         age: 20,
	//     });
	//     return { ...toRefs(state) };
	// },
	data() {
		return {
			age: 20,
		};
	},
};
export default defineComponent({
	mixins: [mixin],
	setup() {
		const state = reactive({
			name: 'hong',
			obj: {
				a: 3,
			},
		});
		return { ...toRefs(state) };
	},

	/* 以下是vue2.0的结果 */
	/* {
            name:'hong',
            obj:{
                a:3,b:2
            },
                :20
        } */
	/* 以下是vue3.0的结果 */
	/* {
            name:'hong',
            obj:{
                a:3
            },
            age:20
        } */
});
</script>
